<template>
    <div id="app">
      <header>
        <div class="container">
          <div class="nav-container">
            <nav>
              <router-link to="/">仪表盘</router-link>
              <router-link to="/analytics">数据分析</router-link>
              <router-link to="/settings">系统设置</router-link>
            </nav>
          </div>
        </div>
      </header>
  
      <main>
        <div class="container">
          <router-view />
        </div>
      </main>
  
      <footer>
        <div class="container">
          <p>© 2023 Vue3 数据可视化仪表盘 | 基于 ECharts 5 构建</p>
        </div>
      </footer>
    </div>
  </template>
  
  <style scoped>
  #app {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
  }
  
  header {
    padding: 1rem 0;
  }
  
  main {
    flex: 1;
    padding: 1.5rem 0;
  }
  
  footer {
    padding: 1.5rem 0;
  }
  </style>